<template>
	<navbar></navbar>
	<textNavbar myprops="服务定价"></textNavbar>
	<view class="fwdj">
		<view class="fwdj-view">
			<view class="fwdj-view-content" v-for="(value, key) in filteredIncProperties" :key="key">
				<view class="fwdj-view-content-left">
					<text v-if="key == 'price2'">私问</text>
					<text v-if="key == 'price3'">计时电话</text>
					<text v-if="key == 'price4'">约见律师</text>
					<text v-if="key == 'price5'">合同审查</text>
					<text v-if="key == 'price6'">文书代写</text>
					<text v-if="key == 'price7'">律师函</text>
					<text v-if="key == 'price8'">户籍调查</text>
					<text v-if="key == 'price9'">民事起诉状</text>
					<text v-if="key == 'price10'">离婚咨询</text>
					<text v-if="key == 'price11'">劳动仲裁委托</text>
					<text v-if="key == 'price12'">委托律师</text>
					<text v-if="key == 'price13'">工伤赔偿</text>
					<text v-if="key == 'price14'">合伙协议</text>
				</view>
				<view class="fwdj-view-content-content">
					<tui-numberbox v-if="key == 'price2'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val1" style="margin-left: 70px;" @change="change1"></tui-numberbox>
					<tui-numberbox v-if="key == 'price3'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val2" style="margin-left: 33px;" @change="change2"></tui-numberbox>
					<tui-numberbox v-if="key == 'price4'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val3" style="margin-left: 44px;" @change="change3"></tui-numberbox>
					<tui-numberbox v-if="key == 'price5'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val4" style="margin-left: 44px;" @change="change4"></tui-numberbox>
					<tui-numberbox v-if="key == 'price6'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val5" style="margin-left: 44px;" @change="change5"></tui-numberbox>
					<tui-numberbox v-if="key == 'price7'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val6" style="margin-left: 62px;" @change="change6"></tui-numberbox>
					<tui-numberbox v-if="key == 'price8'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val7" style="margin-left: 44px;" @change="change7"></tui-numberbox>
					<tui-numberbox v-if="key == 'price9'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val8" style="margin-left: 25px;" @change="change8"></tui-numberbox>
					<tui-numberbox v-if="key == 'price10'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val9" style="margin-left: 33px;" @change="change9"></tui-numberbox>
					<tui-numberbox v-if="key == 'price11'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val10" style="margin-left: -5px;" @change="change10"></tui-numberbox>
					<tui-numberbox v-if="key == 'price12'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val11" style="margin-left: 33px;" @change="change11"></tui-numberbox>
					<tui-numberbox v-if="key == 'price13'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val12" style="margin-left: 33px;" @change="change12"></tui-numberbox>
					<tui-numberbox v-if="key == 'price14'" min="0" max="10000" iconSize="31" width="130" height="50" :value="data.val13" style="margin-left: 44px;" @change="change13"></tui-numberbox>
				</view>
				<view class="fwdj-view-content-right">
					<text>{{value}}</text>
				</view>
			</view>
			<view class="btn" @click="tijiao">提交服务定价</view>
		</view>
		<van-toast id="van-toast" />
	</view>
</template>

<script>
	import Toast from '@vant/weapp/dist/toast/toast';
	import tuiNumberbox from "@/components/thorui/tui-numberbox/tui-numberbox.vue"
	import { getservices, setservices } from "../../../utils/utils";
	export default {
		components:{
				tuiNumberbox
		},
		data() {
			return {
				id: '', // 用户id
				list: {}, // 服务定价
				data: { // 价格
					val1: 0,
					val2: 0,
					val3: 0,
					val4: 0,
					val5: 0,
					val6: 0,
					val7: 0,
					val8: 0,
					val9: 0,
					val10: 0,
					val11: 0,
					val12: 0,
					val13: 0,
				}
			}
		},
		onLoad(option) {
			let that = this
			that.id = option.id
			// console.log(option);
			let a = {
				lawyer_id: option.id
			}
			// let a = {
			// 	lawyer_id: '18'
			// }
			getservices(a, (e) => {
				console.log(e);
				that.list = {...e.data}
				
			})
		},
		methods: {
			// 中间数字框
			change1 (e) {
				this.data.val1 = e.value
			},
			change2 (e) {
				this.data.val2 = e.value
			},
			change3 (e) {
				this.data.val3 = e.value
			},
			change4 (e) {
				this.data.val4 = e.value
			},
			change5 (e) {
				this.data.val5 = e.value
			},
			change6 (e) {
				this.data.val6 = e.value
			},
			change7 (e) {
				this.data.val7 = e.value
			},
			change8 (e) {
				this.data.val8 = e.value
			},
			change9 (e) {
				this.data.val9 = e.value
			},
			change10 (e) {
				this.data.val10 = e.value
			},
			change11 (e) {
				this.data.val11 = e.value
			},
			change12 (e) {
				this.data.val12 = e.value
			},
			change13 (e) {
				this.data.val13 = e.value
			},
			// 判断是否为空
			checkFormData (formData) {
				for (let key in formData) {
					// 如果有任一属性值为空字符串，则返回false，表示不满足条件
					if (!formData[key]) {
							return false;
					}
				}
			return true;
			},
			// 提交服务定价
			tijiao () {
				if (this.checkFormData(this.data)) {
					let a = {
						lawyer_id: this.id,
						inc2: this.data.val1,
						inc3: this.data.val2,
						inc4: this.data.val3,
						inc5: this.data.val4,
						inc6: this.data.val5,
						inc7: this.data.val6,
						inc8: this.data.val7,
						inc9: this.data.val8,
						inc10: this.data.val9,
						inc11: this.data.val10,
						inc12: this.data.val11,
						inc13: this.data.val12,
						inc14: this.data.val13,
					}
					console.log(a);
					setservices(a, (e) => {
						console.log('提交价格',e);
						Toast(e.msg)
						if (e.status == 200) {
							setTimeout(() => {
								uni.navigateBack(-1)
							},2000)
						}
					})
				} else {
					Toast('有价格没有设置，请重新设置')
				}
			},
		},
		computed: {
			filteredIncProperties() {
				const properties = {};
				let count = 0;
				for (const key in this.list) {
					if (key.startsWith('price') && count < 13) {
						properties[key] = this.list[key];
						count++;
					}
				}
				return properties;
			},
		}
	}
</script>

<style lang="scss" scoped>
	.fwdj {
		width: 100vw;
		padding-bottom: var(--safe-area-inset-bottom);
	}
	.fwdj-view {
		width: 90vw;
		margin: 0 auto;
	}
	.fwdj-view-content {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 44px;
		font-weight: bold;
		margin-bottom: 5px;
		font-size: 18px;
	}
	.fwdj-view-content-left {
		background-color: #EDEDED;
		border-radius: 8px;
		padding: 5px 8px;
	}
	.fwdj-view-content-right {
		color: red;
		background-color: #EDEDED;
		border-radius: 8px;
		padding: 5px 8px;
	}
	.btn {
		width: 100%;
		height: 40px;
		background-color: #036faf;
		border-radius: 20px;
		color: white;
		text-align: center;
		line-height: 40px;
	}
</style>
